<script setup>
import { ref } from 'vue'

defineProps({
  msg: {
    type: String,
    required: true
  },
  data: {
    type: Object,
    required: false,
    default (){
        return {id:1, title: '气动固定式球阀Q647F',image: '/src/assets/WX20240324-021156@2x%201.png'}
    }
  }
})



const count = ref(0)
</script>

<template>
    <div class="w-full h-full p-6 relative card border border-undercolor2 border-inside mobile:p-1 ">
        <div class="w-full pt-[100%] relative block">
            <img class="wen-icon h-[98%] w-auto mx-auto" :src="data.image" />
        </div>
        <div class="w-full title">
            <p class="text-2xl pt-6 text-center text-underint line-clamp-1 mobile:py-2 mobile:text-sm">{{ data.title }}</p>
        </div>
    </div>
</template>

<style scoped>
.wen-icon{
    min-width: auto;
    min-height: auto;
    max-width: 96%;
    max-height: 96%;
    width: auto;
    height: 96%;
}
</style>
